A kérdésre adott válaszok közösségi erőfeszítések. A bejegyzés javításához szerkessze a meglévő válaszokat. Jelenleg nem fogad új válaszokat vagy interakciókat. Hogyan terelhetem át a felhasználót az egyik oldalról a másikra a jQuery vagy a tiszta JavaScript használatával?
2020-12-07 21:59:30
1
2
Következő
Az ember nem egyszerűen átirányítja a jQuery használatát
A jQuery nem szükséges, és a window.location.replace (...) szimulálja a legjobban a HTTP-átirányítást.
Az window.location.replace (...) jobb, mint az window.location.href használata, mert a Replace () nem tartja meg az eredeti oldalt a munkamenet előzményeiben, vagyis a felhasználó nem ragad bele egy soha véget nem érő back- gombfiaskó.
Ha szimulálni akarja, hogy valaki egy linkre kattint, használja a
hely.href
Ha egy HTTP átirányítást szeretne szimulálni, használja a location.replace fájlt
Például:
// hasonló viselkedés, mint egy HTTP átirányítás
window.location.replace ("http://stackoverflow.com");
// hasonló viselkedés, mint a linkre kattintás
window.location.href = "http://stackoverflow.com";
|
FIGYELEM: Ezt a választ csupán lehetséges megoldásként adták meg; nyilvánvalóan nem ez a legjobb megoldás, mivel ehhez jQuery szükséges. Ehelyett inkább a tiszta JavaScript megoldást részesítse előnyben.
$ (hely) .attr ('href', 'http://stackoverflow.com')
|
Az oldal átirányításának szokásos "vanília" JavaScript-módja
window.location.href = 'newPage.html';
Vagy egyszerűbben: (mivel az ablak globális)
location.href = 'newPage.html';
Ha azért van itt, mert az átirányításkor elveszíti a HTTP_REFERER fájlt, olvassa tovább:
(Egyébként hagyja figyelmen kívül ezt az utolsó részt)
A következő szakasz azoknak szól, akik a HTTP_REFERER-t használják a sok biztonsági intézkedés egyikeként (bár ez nem egy nagyszerű védelmi intézkedés). Az Internet Explorer 8 vagy annál régebbi verziójának használata esetén ezek a változók elvesznek, ha bármilyen JavaScript-oldal-átirányítást használnak (location.href stb.).
Az alábbiakban egy alternatívát fogunk bevezetni az IE8 és újabb verziókra, hogy ne veszítsük el a HTTP_REFERER fájlt. Ellenkező esetben szinte mindig egyszerűen használhatja az window.location.href fájlt.
A HTTP_REFERER (URL beillesztés, munkamenet stb.) Tesztelése segíthet megmondani, hogy egy kérés jogos-e.
(Megjegyzés: a hivatkozók hivatkozásának megkerülésére / elcsalására is van mód, amint azt a droop linkje megjegyzi)
Egyszerű, böngészőkön átívelő tesztelési megoldás (az window.location.href verzió az Internet Explorer 9+ és minden más böngészőhöz)
Használat: redirect ('anotherpage.aspx');
function redirect (url) {
var ua = navigator.userAgent.toLowerCase (),
isIE = ua.indexOf ('msie')! == -1,
verzió = parseInt (ua.substr (4, 2), 10);
// Internet Explorer 8 és újabb
if (isIE && verzió <9) {
var link = document.createElement ('a');
link.href = url;
document.body.appendChild (link);
link.click ();
}
// Az összes többi böngésző használhatja a szokásos window.location.href fájlt (nem veszítik el a HTTP_REFERER fájlt, mint az Internet Explorer 8 és újabb verziók)
más {
window.location.href = url;
}
}
|
Ennek rengeteg módja van.
// ablak.hely
window.location.replace ('http://www.example.com')
window.location.assign ('http://www.example.com')
window.location.href = 'http://www.example.com'
document.location.href = '/ elérési út'
// ablak.történet
window.history.back ()
window.history.go (-1)
// ablak.navigate; CSAK az Internet Explorer régi verzióihoz
window.navigate ('top.jsp')
// Valószínűleg nincs bueno
self.location = 'http://www.example.com';
top.location = 'http://www.example.com';
// jQuery
$ (hely) .attr ('href', 'http: //www.example.com')
$ (ablak) .attr ('hely', 'http: //www.example.com')
$ (hely) .prop ('href', 'http://www.example.com')
|
Ez minden böngészőnél működik:
window.location.href = 'your_url';
|
Segítene, ha egy kicsit leíróbb lenne abban, amit próbál. Ha lapozott adatokat akar létrehozni, akkor ennek lehetősége van néhány lehetőségre. Minden oldalhoz külön linkeket generálhat, amelyekhez közvetlenül el akar jutni.
1
2
3
...
Ne feledje, hogy a példa aktuális oldalát a kód és a CSS másképp kezeli.
Ha azt akarja, hogy az átlapolt adatokat az AJAX-on keresztül változtassa meg, akkor itt jönne be a jQuery. Ha azt tenne, hogy egy kattintáskezelőt adna az egyes horgonycímkékhez, amelyek egy másik oldalnak felelnek meg. Ez a kattintáskezelő meghívna néhány jQuery-kódot, amely az AJAX-on keresztül beolvassa a következő oldalt és frissíti a táblázatot az új adatokkal. Az alábbi példa feltételezi, hogy van egy webszolgáltatása, amely visszaadja az új oldaladatokat.
$ (dokumentum) .ready (függvény () {
$ ('a.pager-link'). kattintson (function () {
var oldal = $ (this) .attr ('href'). split (/ \? /) [1];
$ .ajax ({
típus: 'POST',
url: '/ elérési út a szolgáltatáshoz',
adatok: oldal,
siker: függvény (tartalom) {
$ ('# myTable'). html (tartalom); // csere
}
});
return false; // a link leállításához
});
});
|
Úgy gondolom, hogy a location.replace (URL) is a legjobb módszer, de ha értesíteni szeretné a keresőket az átirányításról (nem elemzik a JavaScript kódot az átirányítás megtekintéséhez), vegye fel a rel = "canonical" metát címkét a webhelyére.
Noscript szakasz hozzáadása HTML frissítő metacímkével szintén jó megoldás. Javaslom, hogy használja ezt a JavaScript átirányítási eszközthozzon létre átirányításokat. Internet Explorer támogatással is rendelkezik a HTTP hivatkozó átadásához.
A mintakód késedelem nélkül így néz ki:
licenc alatt áll
címre esik
|
De ha valaki vissza akar irányítani a kezdőlapra, akkor a következő részletet használhatja.
window.location = window.location.host
Hasznos lenne, ha három különböző környezete van, mint fejlesztés, stádiumozás és gyártás.
Felfedezheti ezt az ablakot vagy window.location objektumot, ha ezeket a szavakat csak a Chrome konzolba vagy a Firebug konzoljába teszi.
|
A JavaScript számos módszert kínál a böngésző címsorában megjelenő jelenlegi URL letöltésére és megváltoztatására. Mindezek a módszerek a Location objektumot használják, amely a Window objektum tulajdonsága. Az alábbiak szerint hozhat létre egy új Hely objektumot, amelynek jelenlegi URL-je van.
var currentLocation = ablak.location;
Az URL alapstruktúrája
//:/
Protokoll - Meghatározza a protokoll nevét, amelyet az interneten lévő erőforrás eléréséhez kell használni. (HTTP (SSL nélkül) vagy HTTPS (SSL nélkül))
hosztnév - A hosztnév megadja az erőforrást birtokló hosztot. Például: www.stackoverflow.com. A szerver a gazdagép nevét felhasználva nyújt szolgáltatásokat.
port - egy portszám, amely egy adott folyamat felismerésére szolgál, amelyre az internetet vagy más hálózati üzenetet továbbítani kell, amikor az kiszolgálóhoz érkezik.
elérési út - Az elérési út információt ad a gazdagépen belüli erőforrásról, amelyhez a webes ügyfél hozzáférni akar. Például a stackoverflow.com/index.html.
lekérdezés - A lekérdezési karaktersorozat követi az elérési út összetevőt, és információt nyújt, amelyet az erőforrás valamilyen célra felhasználhat (például keresési paraméterként vagy feldolgozandó adatként).
hash - Az URL horgonyrésze tartalmazza a kivonatjelet (#).
Ezekkel a Helyobjektum tulajdonságokkal elérheti ezeket az URL-összetevőket
hash - Beállítja vagy visszaadja az URL horgony részét.
host -Setek
vagy visszaadja az URL gazdagépnevét és portját.
hosztnév -Set vagy
egy URL gazdagépnevét adja vissza.
href - Beállítja vagy visszaadja az egészet
URL.
elérési út - Beállítja vagy visszaadja az URL elérési útját.
port - Beállítja vagy visszaadja a kiszolgáló által az URL-hez használt portszámot.
protokoll - Beállítja vagy visszaadja az URL protokollját.
keresés -Készletek
vagy egy URL lekérdezési részét adja vissza
Most Ha módosítani szeretne egy oldalt, vagy át akarja irányítani a felhasználót egy másik oldalra, akkor a Hely objektum href tulajdonságát használhatja
Használhatja a Location objektum href tulajdonságát.
window.location.href = "http://www.stackoverflow.com";
A Location Object szintén rendelkezik ezzel a három módszerrel
hozzárendelés () - Új dokumentum betöltése.
reload () - Az aktuális dokumentum újratöltése.
csere () - Az aktuális dokumentumot lecseréli egy újra
A hozzárendelés () és a metódusok használatával átirányíthat más ilyen oldalakra is
hely.megosztás ("http://www.stackoverflow.com");
location.replace ("http://www.stackoverflow.com");
Hogyan különbözik a hozzárendelés () és a helyettesítés () különbség - A csere () és a hozzárendelés () módszer () közötti különbség az, hogy a csere () eltávolítja az aktuális dokumentum URL-jét a dokumentumelőzményekből, ami azt jelenti, hogy nem lehet a "vissza" gombra az eredeti dokumentumhoz való visszatéréshez. Tehát használja a assign () metódust, ha új dokumentumot szeretne betölteni, és meg szeretné adni a lehetőséget, hogy visszalépjen az eredeti dokumentumhoz.
Megváltoztathatja a href helyobjektum tulajdonságot a jQuery szintén ehhez hasonló használatával
$ (hely) .attr ('href', url);
Ezért átirányíthatja a felhasználót egy másik URL-re.
|
A jQuery alapvetően csak egy JavaScript keretrendszer, és néhány olyan dolog elvégzéséhez, mint ebben az esetben az átirányítás, csak tiszta JavaScriptet használhat, így ebben az esetben 3 lehetőség van vaníliaJavaScript:
1) A helycsere használatával ez helyettesíti az oldal jelenlegi történetét, ami azt jelenti, hogy a Vissza gombbal nem lehet visszatérni az eredeti oldalra.
window.location.replace ("http://stackoverflow.com");
2) A hely hozzárendelésével ez megőrzi az előzményeket, és a Vissza gomb használatával visszatérhet az eredeti oldalra:
window.location.assign ("http://stackoverflow.com");
3) Javaslom az előző módszerek egyikét, de ez lehet a harmadik lehetőség a tiszta JavaScript használatával:
window.location.href = "http://stackoverflow.com";
A jQuery-be is írhat egy függvényt a kezelésére, de nem ajánlott, mivel ez csak egy sor tiszta JavaScript-függvény, emellett az összes fenti függvényt ablak nélkül is használhatja, ha már az ablak hatókörében van, például window.location.replace ("http://stackoverflow.com"); lehet a location.replace ("http://stackoverflow.com");
Ezenkívül megmutatom mindet az alábbi képen:
|
Csak a window.location használatával kell beállítani.
Példa:
window.location = "https://stackoverflow.com/";
Itt van egy korábbi bejegyzés a témáról: Hogyan lehet átirányítani egy másik weboldalra?
|
Mielőtt elkezdeném, a jQuery egy JavaScript könyvtár, amelyet DOM-manipulációra használnak. Tehát nem szabad a jQuery-t használni az oldal átirányításához.
Idézet a Jquery.com-tól:
Míg a jQuery nagyobb problémák nélkül futtatható a régebbi böngészőverziókban,
nem teszteljük aktívan a jQuery-t bennük, és általában nem javítjuk a hibákat
ami megjelenhet bennük.
Itt találták:
https://jquery.com/browser-support/
Tehát a jQuery nem minden vége és megoldása a visszamenőleges kompatibilitásnak.
A következő nyers JavaScriptet használó megoldás minden böngészőben működik, és hosszú ideje szabványos, így nincs szükség könyvtárakra a böngészők közötti támogatáshoz.
Ez az oldal 3000 milliszekundum után átirányítja a Google-hoz
példa
Hamarosan átirányítják a Google-ra.